import React from "react";
import { Card, Divider } from "react-vant";
import "./style.css";

interface StatsCardProps {
  title: string;
  value: string | number;
  icon: React.ReactNode;
  color?: string;
}

const StatsCard: React.FC<StatsCardProps> = ({
  title,
  value,
  icon,
  color = "#1989fa",
}) => {
  return (
    <Card round className="stats-card">
      <div className="stats-content">
        <div className="stats-icon" style={{ backgroundColor: color }}>
          {icon}
        </div>
        <div className="stats-info">
          <div className="stats-value">{value}</div>
          <div className="stats-title">{title}</div>
        </div>
      </div>
    </Card>
  );
};

export default StatsCard;
